import { chartEncaps } from './chartEncaps.js'
import { colorRgb } from '../../../util/colorConversion'
let drawc3 = obj => {
  var myChart = document.getElementById(obj.doms)
  myChart.style.width = '700px'
  myChart.style.height = '700px'
  myChart.innerHTML = ''
  if (myChart.getAttribute('_echarts_instance_')) {
    myChart.removeAttribute('_echarts_instance_') // 移除容器上的 _echarts_instance
  }
  let data = []
  if (obj._t.chartsConData.repeat === '1') {
    for (let i = 0; i < obj._t.chartData.length; i++) {
      data.push(obj._t.chartData[i])
      let d = obj._t.chartData[i].value / 15
      for (let j = 0; j < 19; j++) {
        data.push({
          name: obj._t.chartData[i].name,
          value: d
        })
        // obj._t.color.push(obj._t.color[i])
      }
    }
  } else {
    data = obj._t.chartData
  }
  obj._t.chart = obj._t.$echarts.init(document.getElementById(obj.doms))
  var maskResource = new Image()
  maskResource.src = obj._t.cloudImg
  var option = {
    // 设置标题，居中显示
    title: {
      text: '',
      left: 'center'
    },
    // 数据可以点击
    tooltip: {},
    series: [
      {
        maskImage: maskResource,
        // 词的类型
        type: 'wordCloud',
        // gridSize: 3, // 字体分布的密集程度
        // 设置字符大小范围
        sizeRange: [12, 100],
        rotationRange: [0, 0],
        left: 'center',
        top: 'center',
        textStyle: {
          normal: {
            // 生成随机的字体颜色
            // color: obj._t.color[m++].colorRgb()
            color: function() {
              let color = colorRgb(obj._t.color[0])
              return color
            }
          },
          emphasis: {
            // 鼠标移入的特效样式
            shadowBlur: 8,
            shadowColor: '#333'
          }
        },
        // 不要忘记调用数据
        data: data,
        width: 700,
        height: 700,
        drawOutOfBound: false
      }
    ]
  }

  // 加载图像，将数据放在图像中
  maskResource.onload = () => {
    if (obj._t.chartsConData.bagShow === '1') {
      option.backgroundColor = {
        type: 'pattern',
        repeat: 'no-repeat',
        image: maskResource // 赋值
      }
    } else {
      option.backgroundColor = 'transparent'
    }
    obj._t.chart.setOption(option)
    chartEncaps.setDisplay({ doms: obj.doms, display: 'table' })
    obj._t.setLoading(false)
    obj._t.setshadeDisplay(true)
  }

  window.onresize = obj._t.chart.resize
}

export { drawc3 }
